<!DOCTYPE html>
<html>
<head>
    <title>Find BART Statistics</title>
</head>
<body>
<h1>BART Stats-Average Weekday Exits by Station</h1>

    <select name="stations" id="stations" onchange="sendData();">
    {%  for stations in data %}
        <option value="{{ stations }}">{{ stations }}</option>
    {% endfor %}
    </select>
<h1></h1>
<div id="return">


</div>
<script>

    function sendData(){

        var station=document.getElementById("stations").value;

        var url="http://127.0.0.1:5000/graph";
        var param="station="+station;
        var http=new XMLHttpRequest();
        http.open("POST", url, true)
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        http.onreadystatechange=function(){
            if(http.readyState==4 && http.status==200){
               document.getElementById("return").innerHTML=http.responseText;
            }


        }
        http.send(param);
    }

</script>


</body>
</html>